<!-- 分页组件 -->
<template>
  <div>
    <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :page-sizes="pageSizes" :current-page="currentPage" :page-size="currentPageSize" :total="total" layout="prev, pager, next, jumper, total, sizes">
    </el-pagination>
  </div>
</template>

<script>
import { pagination } from '@curd/curd'
export default {
  mixins: [pagination()],
  props: {
    // 总共有多少行数据
    total: {
      type: Number,
      required: true
    },
    // 初始化当前页有多少行
    pageSize: {
      type: Number
    }
  },
  data () {
    return {
      pageSizes: [10, 30, 45, 60], // 分页数组
      currentPageSize: this.pageSize, // 当前页有多少行
      currentPage: 1 // 当前第几页
    }
  },
  methods: {
    handleSizeChange (val) {
      this.currentPageSize = val;
      this.$emit('refreshTable');
    },
    handleCurrentChange (val) {
      this.currentPage = val;
      this.$emit('refreshTable');
    }
  }
}
</script>

<style>
</style>
